<template>
    <el-row class="lives-news">
        <el-row class="title">
            <h3>店铺详情</h3>
        </el-row>
        <el-row>
            <el-form :inline="true">
                <el-form-item>
                    <el-button type="primary" icon="arrow-left" @click="back">返回列表</el-button>
                </el-form-item>
            </el-form>
        </el-row>
        <el-row v-if="salesmanDetail">
            <h3>业务员信息</h3>
            <el-form label-width="120px">
                <el-form-item label="代理商ID：" class="label">{{salesmanDetail.agentId}}</el-form-item>
                <el-form-item label="业务员ID：" class="label">{{salesmanDetail.merchandiserId}}</el-form-item>
                <el-form-item label="业务员名字" class="label">{{salesmanDetail.merchandiserName}}</el-form-item>
            </el-form>
        </el-row>
    </el-row>
</template>
<script>
	import {
		getSalesmanInfo,
	} from '@/api/api'
	import ElFormItem from "../../../node_modules/element-ui/packages/form/src/form-item.vue";
	export default {
		components: {ElFormItem},
		data: function() {
			return {
				salesmanDetail: null
			}
		},
		created: function() {
			var merchandiserId = this.$route.query.merchandiserId;
			if (!merchandiserId) {
				this.$message({
					type: 'error',
					message: '业务员查询失败'
				})
				setTimeout(() => {
					this.$router.push('/salesmanList')
				}, 2500);
				return;
			}
			console.log(merchandiserId);
			this.getSalesmanDetail(merchandiserId);
		},
		methods: {
			getSalesmanDetail: function(merchandiserId) {
				getSalesmanInfo(merchandiserId).then(res => {
					console.log(res)
					this.salesmanDetail = res;
				}).catch(err => {
					console.log(err)
					setTimeout(() => {
						this.$router.push('/salesmanList')
					}, 2500)
				})
			},
			back: function(){
				this.$router.push('/salesmanList')
			}
		}
	}
</script>
<style scoped lang="scss">
    .lives-news {
        .title {
            font-size: 12px;
            border-bottom: 1px solid #eaeaea;
            margin-bottom: 5px;
            h3 {
                display: inline-block;
                padding: 5px 0;
                margin: 0;
                font-weight: normal;
                color: #23b7e5;
                border-bottom: 1px solid #23b7e5;
            }
        }
        .label-color {
            color: red;
        }
        img{
            width: 100px;
            vertical-align: middle;
            height: auto;
        }
        .settlement{
            margin: 15px 0;
        }
        .el-form-item {
            margin-bottom: 5px;
        }
    }
</style>